<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container >
      <a-form :form="form" slot="detail">

        <a-row >
        
          <a-row :style="styleObj">
            
            <a-col :span="12">
              <a-form-item label="标题" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input :disabled="Disableds" v-decorator="['titlesummary', { rules: [{ required: true, message: '请填写必填项!' }] }]" placeholder="请输入标题" ></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="产品名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-dict-select-tag
                  :disabled="Disableds"
                  type="radio"
                  v-decorator="['proname',{ initialValue: 'HZB'}, { rules: [{ required: true, message: '请填写必填项!' }] }]"
                  :trigger-change="true"
                  dictCode="proname"
                  placeholder="" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="问题类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-dict-select-tag
                  :disabled="Disableds"
                  type="radio"
                  v-decorator="['questiontype',{ initialValue: 'XQ'}, { rules: [{ required: true, message: '请填写必填项!' }] }]"
                  :trigger-change="true"
                  dictCode="task_type"
                  placeholder="请选择问题类型" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="需求类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-dict-select-tag
                  :disabled="Disableds"
                  type="radio"
                  v-decorator="['needtype',{ initialValue: '任务'}, { rules: [{ required: true, message: '请填写必填项!' }] }]"
                  :trigger-change="true"
                  dictCode="task_xq_type"
                  placeholder="请选择需求类型" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="紧急程度" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-dict-select-tag
                  :disabled="Disableds"
                  type="radio"
                  v-decorator="['priority',{ initialValue: 'Medium'}, { rules: [{ required: true, message: '请填写必填项!' }] }]"
                  :trigger-change="true"
                  dictCode="jjcd"
                  placeholder="请选择紧急程度" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="问题公开" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-dict-select-tag
                  :disabled="Disableds"
                  type="radio"
                  v-decorator="['sfgk',{ initialValue: '1'}, { rules: [{ required: true, message: '请填写必填项!' }] }]"
                  :trigger-change="true"
                  dictCode="isgk"
                  placeholder="请选择是否公开" />
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="模块" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-multi-select-tag
                  :disabled="Disableds"
                  type="checkbox"
                  v-decorator="['project']"
                  :trigger-change="true"
                  dictCode="module"
                  placeholder="请选择问题所属项目" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="影响范围" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input :disabled="Disableds" v-decorator="['influenceregion', { rules: [{ required: true, message: '请填写必填项!' }] }]" placeholder="请输入影响范围,多个地区请用逗号分割" ></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="影响行业" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-multi-select-tag
                  type="list_multi"
                  :disabled="Disableds"
                  v-decorator="['influenceindustry', { rules: [{ required: true, message: '请填写必填项!' }] }]"
                  :trigger-change="true"
                  dictCode="industry"
                  placeholder="请选择影响行业" />
              </a-form-item>
            </a-col>

            <a-col :span="12">
              <a-form-item label="反馈人" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input :disabled="Disableds" v-decorator="['fkuser', { rules: [{ required: true, message: '请填写必填项!' }] }]" placeholder="请输入反馈人" ></a-input>
              </a-form-item>
            </a-col>

            <a-col :span="12">
              <a-form-item label="反馈人身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-dict-select-tag
                  type="list"
                  :disabled="Disableds"
                  v-decorator="['fkusersf', { rules: [{ required: true, message: '请填写必填项!' }] }]"
                  :trigger-change="true"
                  dictCode="fkr_sf"
                  placeholder="请选择反馈人身份" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="要求上线时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-date
                  placeholder="请选择要求上线时间"
                  :disabled="Disableds"
                  v-decorator="['endtime']"
                  :disabledDate="disabledDate"
                  :trigger-change="true"
                  style="width: 100%" />
              </a-form-item>
            </a-col>

            <a-col :span="12">
              <a-form-item label="附件" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <!-- <a-icon type="search" v-if="sfshow" @click="yulan" /><br /> -->
                <j-upload :disabled="Disableds" :beforeUpload="beforeUpload" @change="changewj" v-decorator="['fileguid']" :trigger-change="true" ></j-upload>
                <span v-if="sfshow" @click="yulan" style="padding-left: 5px;">
                  <a-icon type="eye" />
                  <a style="padding-left: 9px;">查看已上传文件</a>
                </span>

              </a-form-item>
            </a-col>

            <a-col :span="24">
              <a-alert message="内容填写暂不支持图片添加及表格,如需添加请上传至附件!" type="error" style="width: 500px; margin-left: 237px;" show-icon />
              <a-form-item label="问题详细内容" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-editor :disabled="Disableds" v-decorator="['questioncontent',{trigger:'input'}]" />
              </a-form-item>
            </a-col>

            <a-divider >方案</a-divider>
            <!-- <a-card title="方案出具详情" v-if="facjxq" > -->
            <a-col :span="12">
              <a-form-item label="方案名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input  :disabled="Disableds" v-decorator="['faname']" ></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="12" >
              <a-form-item label="方案提交时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-date
                   :disabled="Disableds"
                  v-decorator="['fatjtime']"
                  :trigger-change="true"
                  :disabledDate="disabledDate"
                  style="width: 100%"
                />
              </a-form-item>
            </a-col>
            <a-col  :span="12">
              <a-form-item label="预计完成时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-date
                  placeholder="预计完成时间未确定"
                  :disabled="Disableds"
                  v-decorator="['yjovertime']"
                  :disabledDate="disabledDate"
                  :trigger-change="true"
                  style="width: 100%" />
              </a-form-item>
            </a-col>
            <a-col :span="12" >
              <a-form-item label="方案提交人" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input  :disabled="Disableds" v-decorator="['fatcusername']" ></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="12" >
              <a-form-item label="方案附件" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-upload  :disabled="Disableds" v-decorator="['fafileid']" :trigger-change="true"></j-upload>
              </a-form-item>
            </a-col>

            <a-col :span="24" >
              <a-form-item label="方案详细内容" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-editor  :disabled="Disableds" v-decorator="['fams', { trigger: 'input' }]" />
              </a-form-item>
            </a-col>
            <a-col :span="24" >
              <a-form-item label="是否入需求导出库" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-radio-group v-model = "highestbjs" >
                     <a-radio :value="1">
                       是
                     </a-radio>
                     <a-radio :value="2">
                       否
                     </a-radio>
                
                   </a-radio-group>
              </a-form-item>
            </a-col>

            <a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center;">
              <a-button @click="bdtjlc">提 交</a-button>
            </a-col>
          </a-row>

        </a-row></a-form>
    </j-form-container>
  </a-spin>
</template>

<script>

  // import { base64 } from '@/utils/base64.min'
  import { httpAction, getAction } from '@/api/manage'
  import pick from 'lodash.pick'
  import { validateDuplicateValue } from '@/utils/util'
  import JFormContainer from '@/components/jeecg/JFormContainer'
  import JUpload from '@/components/jeecg/JUpload'
  import JDate from '@/components/jeecg/JDate'
  import JDictSelectTag from '@/components/dict/JDictSelectTag'
  import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
  import JEditor from '@/components/jeecg/JEditor'
  import moment from 'moment'
  import 'moment/locale/zh-cn'

  export default {
    name: 'TtQuestionCollectYxjpxForm',
    components: {
      JFormContainer,
      JUpload,
      JDate,
      JDictSelectTag,
      JMultiSelectTag,
      JEditor
    },
    props: {
      // 流程表单data
      formData: {
        type: Object,
        default: () => {},
        required: false
      },
      // 表单模式：true流程表单 false普通表单
      formBpm: {
        type: Boolean,
        default: false,
        required: false
      },
      // 表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        highestbjs:1,
        filename: '',
        lcid: '',
        form: this.$form.createForm(this),
        model: {},
        wjurl: '',
        Disableds:true,
        // 方案显示参数
        facjxq: true,
        isfacj: true,
        fileList: [],
        sfshow: false,
        styleObj2: {
          width: '82%',
          float: 'left'
        },
        styleObj: {},
        styleObj1: {
          width: '100%'

        },

        pcphonefloat: '',
        pcfloatwidth: {
         float: 'right',
         width: '18%'
        },
        phonefloatwidth: {
         float: 'bottom'
        },
         todos: [],
         jdjpg: 'down-circle',
         draweris: false,
         iscklc: false,
         col: '',
          labelCol: {
          xs: { span: 24 },
          sm: { span: 5 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 }
        },
        confirmLoading: false,
        validatorRules: {
        },
        url: {
          add: '/tt_question_collect/ttQuestionCollect/add',
          edit: '/tt_question_collect/ttQuestionCollect/edit',
          queryById: '/tt_question_collect/ttQuestionCollect/queryById',
          tjlc: '/tt_question_collect/ttCollectFlowNode/submitProcess',
          flowcodelist: '/tt_question_collect/ttCollectFlowNode/list',
          queryByquestionId: '/tt_question_collect/ttPlanConfirm/queryByquestionId',
          updateyxjbj: '/tt_question_collect/xqexport/updateyxjbj'
        }
      }
    },
    computed: {
      formDisabled() {
        if (this.formBpm === true) {
          if (this.formData.disabled === false) {
            return false
          }
          return true
        }
        return this.disabled
      },
      showFlowSubmitButton() {
        if (this.formBpm === true) {
          if (this.formData.disabled === false) {
            return true
          }
        }
        return false
      }
    },
    created () {
      // 如果是流程中表单，则需要加载流程表单data
      this.showFlowData()
    },
    methods: {

      // 获取问题方案详情
      getfacjxqnr(record, bmlcid) {
        getAction(this.url.queryByquestionId, { questionid: record.id }).then((res) => {
          if (res.success) {
            console.log(res.result)
            if (res.result != null) {
              record['faname'] = res.result.planname
              record['fafileid'] = res.result.fileid
              record['fams'] = res.result.planDescribe
              record['fatjtime'] = res.result.createTime
            }

             this.edit(record)
            console.log('record', record)
          }
        })
      },

      beforeUpload(file, fileList) {
        console.log(file)
      },

      changewj(info) {
   console.log(info)
    this.fileList = info.split(',')
   console.log(this.fileList)
     if (this.fileList[0] !== '') {
       this.sfshow = true
     } else {
       this.sfshow = false
     }
        },

      yulan() {
        let Base64 = require('js-base64').Base64 // base64编码
        for (var a = 0; a < this.fileList.length; a++) {
          console.log('文件列表', this.fileList[a])
          var url = 'http://work.hbidding.com/jeecg-boot/sys/common/static/' + this.fileList[a] // 要预览文件的访问地址

          window.open('http://work.hbidding.com/preview/onlinePreview?url=' + encodeURIComponent(Base64.encode(url)))
         }
      },


      add (bmlcid) {
        this.lcid = bmlcid
        console.log(this.lcid)
        this.edit({})
      },

      wtfaedit(record) {
        this.getfacjxqnr(record)
      },

      edit (record) {
        debugger
       this.highestbjs = record.highestbj
        if (record.fileguid != null) {
          this.sfshow = true
          this.fileList = record.fileguid.split(',')
          console.log(this.fileList)
        } else {
          this.sfshow = false
        }
        
        this.form.resetFields()
        this.model = Object.assign({}, record)
        this.visible = true
        this.$nextTick(() => {
          this.form.setFieldsValue(pick(this.model, 'titlesummary', 'project', 'questiontype','highestbj', 'needtype', 'priority', 'influenceregion', 'influenceindustry', 'questioncontent', 'poroposername', 'endtime', 'collectorname', 'auditstatus', 'fileguid', 'dealstatus', 'proname', 'fkuser', 'fkusersf', 'yjovertime', 'sfgk', 'fatjtime', 'fatcusername', 'faname', 'fams', 'fafileid'))
        })
      },
      disabledDate(current) {
        return current && current <= moment().endOf('day') - 24 * 60 * 60 * 1000
      },
      // 渲染流程表单数据
      showFlowData() {
        if (this.formBpm === true) {
          let params = { id: this.formData.dataId }
          getAction(this.url.queryById, params).then((res) => {
            if (res.success) {
              this.edit(res.result)
            }
          })
        }
      },

     
   

      submitForm () {
        const that = this
        // 触发表单验证
        this.form.validateFields((err, values) => {
          debugger
          if (!err) {
            that.confirmLoading = true
            let httpurl = ''
            let method = ''
            if (!that.model.id) {
              httpurl += that.url.add
              method = 'post'
            } else {
              httpurl += that.url.updateyxjbj
               method = 'put'
            }

            let formData = Object.assign(that.model, values)
            formData.highestbj = that.highestbjs
            console.log('表单提交数据', formData)
            httpAction(httpurl, formData, method).then((res) => {
              if (res.success) {
         
               

                that.$message.success(res.message)
                that.$emit('ok')
              }  else {
                that.$message.warning(res.message)
              }
            }).finally(() => {
              that.confirmLoading = false
            })
          }
        })
      },
      popupCallback(row) {
        this.form.setFieldsValue(pick(row, 'titlesummary', 'project', 'questiontype','highestbj', 'needtype', 'priority', 'influenceregion', 'influenceindustry', 'questioncontent', 'poroposername', 'endtime', 'collectorname', 'auditstatus', 'fileguid', 'dealstatus', 'proname', 'fkuser', 'fkusersf', 'yjovertime', 'sfgk', 'fatjtime', 'fatcusername', 'faname', 'fams', 'fafileid'))
      }
    }
  }
</script>
